<template lang="html">
    <div id="subject">
        <section class="msearch-section ng-scope">
            <div class="msearch-input" style="box-shadow: 0px 7px 34px -12px #7A808F">
                <form class="ng-pristine ng-valid">
                    <input type="search" id="mindex-key" autocomplete="off" autocorrect="off"  placeholder="请输入企业名" v-model="seachtext">
                    <button @click="seach()"></button>
                </form>
            </div>
        </section>
        <section class="job-list">
            <ul>
                <li class="item">
                   <router-link :to='{name: "Enterprisedetails"}'>
                       <img src="../../img/default.jpg">
                        <div class="text">
                            <div class="title">
                                <h4>济南伊利乳业有限责任公司</h4><span class="salary">监管</span></div>
                            <div class="name">孙东宏</div>
                            <div class="msg"><em>平阴县济西工业园区</em></div>
                        </div>
              </router-link>
                </li>
                <li class="item">
                   <router-link :to='{name: "Enterprisedetails"}'>
                       <img src="../../img/default.jpg">
                        <div class="text">
                            <div class="title">
                                <h4>济南伊利乳业有限责任公司</h4><span class="salary">监管</span></div>
                            <div class="name">孙东宏</div>
                            <div class="msg"><em>平阴县济西工业园区</em></div>
                        </div>
              </router-link>
                </li>
            </ul>
        </section>
    </div>
</template>

<script>
    import axios from 'axios';
    export default {
        components: {
    
        },
        data() {
            return {
            seachtext:'',

            };
        },
    
        //方法
        methods: {
        seach:function(){
            alert()
        }
        }
    }
</script>

<style lang="scss" scoped>
    .msearch-section {
        background: url(../../img/banner.png) no-repeat;
        width: 100%;
        padding-top: 51.5625%;
        background-size: 100%;
    }
    
    .msearch-input {
        display: block;
        border: 1px solid #BDC0C6;
        border-radius: 2px;
        height: 40px;
        margin: -65px 15px 0;
        line-height: 40px;
        background: #fff;
        color: #7a808f;
        input {
            width: 90%;
            padding-left: 15px;
            width: 90%;
            padding-left: 15px;
            height: 39px;
            border: none;
            box-sizing: border-box;
        }
        button {
            background: url(../../img/seach.png) center center no-repeat;
            width: 10%;
            background-size: 20px;
            display: block;
            height: 38px;
            border: 0;
            float: right;
        }
    }
    
    .job-list ul .item {
        height: 91px;
        position: relative;
    }
    
    .job-list ul .item a {
        display: block;
        height: 100%;
    }
    
    .job-list ul .item img {
        width: 59px;
        height: 59px;
        display: block;
        border: none;
        margin-left: 18px;
        margin-top: 16px;
        float: left;
        border-radius: 5px;
    }
    
    .job-list .text {
        margin-left: 96px;
        position: relative;
    }
    
    .job-list .text h4 {
        font-size: 15px;
        color: #414a60;
        line-height: 15px;
        font-weight: 400;
        padding-top: 18px;
        margin-right: 90px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin: 0px;
    }
    
    .job-list .text .salary {
        font-style: normal;
        font-size: 15px;
        color: #FC6C38;
        position: absolute;
        right: 19px;
        top: 18px;
        line-height: 15px;
    }
    
    .job-list .text .name {
        font-size: 12px;
        color: #414a60;
        line-height: 28px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-right: 19px;
    }
    
    .job-list .text .msg {
        line-height: 13px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-right: 19px;
    }
    
    .job-list .text .msg em {
        font-style: normal;
        font-size: 12px;
        color: #8892ac;
        margin-right: 14px;
        display: inline-block;
    }
</style>
